<!DOCTYPE html>
<html lang="zh-cn">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <style>
    .wrap{
      /* width: 300px;
      height: 300px; */
      display: grid;
      grid-template-columns: 1fr 1fr 1fr;
      grid-gap: 1px;
      position:absolute;
      top:0;
      left:0;
      right:0;
      bottom:0;
      background-color: #000;
    }
    .wrap div{
      background: pink;
    }
    .wrap .box1{
      background: green;
      grid-column: span 2;
    }
  </style>
  <link rel="stylesheet" href="bootstrap-4.5.0-dist/css/bootstrap.min.css">
</head>
<body>
    <head>
      <img src="" alt="">
    </head>
    <nav>
   <ul>
    <li class="nav-item">
        <a href="#" class="nav-link">首页</a>
    </li>
    <li class="nav-item">
        <a href="#" class="nav-link">标题1</a>
    </li>
    <li class="nav-item">
        <a href="#" class="nav-link">标题2</a>
    </li>
   </ul>
    </nav>
  <div class="wrap">
    <div>1</div>
    <div class="box1">2</div>
    <div>3</div>
    <div>4</div>
    <div class="box2">5</div>
    <div>6</div>
    <div>7</div>
    <div>8</div>
    <div>9</div>
    <div>10</div>
    <div>11</div>
  </div>
</body>
</html>

